﻿<%@ Page Title="" Language="C#" MasterPageFile="~/default.Master" AutoEventWireup="true" CodeBehind="RoomBooking.aspx.cs" Inherits="DelonixRegia.RoomBooking" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="cphPageTitle" runat="server">
    Room Booking - Delonix Regia
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="cphTitle" runat="server">
    <i class="fa fa-book"></i> Room Booking
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="cphSubtitle" runat="server">
    Book a Room in Delonix Regia
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="cphMain" runat="server">
    <asp:Panel ID="pnlFirstStep" runat="server">
        <div class="panel panel-default" style="width: 800px; margin: 0 auto;">
            <div class="panel-heading">
                Book a Room
            </div>

            <div class="panel-body">
                <div class="alert alert-danger" id="errorBox" style="display: none;">
                </div>

                <table class="nav-justified">
                    <tr>
                        <td colspan="6">
                            <table class="nav-justified" style="width: 550px;" align="center">
                                <tr>
                                    <td class="text-right" style="width: 138px">Number of Adult(s):</td>
                                    <td style="width: 15px">&nbsp;</td>
                                    <td>
                                        <asp:TextBox ID="tbxNoAdult" runat="server" CssClass="form-control" MaxLength="3" Width="66px">0</asp:TextBox>
                                    </td>
                                    <td class="text-right" style="width: 139px">Number of Children:</td>
                                    <td style="width: 15px">&nbsp;</td>
                                    <td>
                                        <asp:TextBox ID="tbxNoChildren" runat="server" CssClass="form-control" MaxLength="3" Width="66px">0</asp:TextBox>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="6" class="text-center">&nbsp;</td>
                    </tr>
                    <tr>
                        <td colspan="6" class="text-center">
                            <asp:Button ID="btnQuery" runat="server" Text="Query" CssClass="btn btn-default" OnClientClick="return verifyNoGuestInput();" OnClick="btnQuery_Click" />
                        </td>
                    </tr>
                    <tr>
                        <td style="width: 156px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td style="width: 205px">&nbsp;</td>
                        <td style="width: 108px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                    <tr>
                        <td class="text-center" colspan="6">
                            <asp:GridView ID="gvResult" runat="server" CssClass="table table-bordered" HorizontalAlign="Center" Width="80%" OnRowDataBound="gvResult_RowDataBound" Visible="False">
                                <Columns>
                                    <asp:TemplateField>
                                        <ItemTemplate>
                                            <asp:Button ID="btnSelect" runat="server" OnClick="btnSelect_Click" Text="Select" />
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                </Columns>
                                <EmptyDataTemplate>
                                    <asp:Label ID="Label1" runat="server" Font-Bold="True" ForeColor="Red" Text="No rooms found with given criteria!"></asp:Label>
                                </EmptyDataTemplate>
                                <HeaderStyle BackColor="WhiteSmoke" />
                            </asp:GridView>
                            <table class="nav-justified" style="width: 50%;" align="center">
                                <tr>
                                    <td style="width: 160px; text-align: right;">Room Number:</td>
                                    <td style="width: 34px; text-align: right;">&nbsp;</td>
                                    <td>
                                        <asp:TextBox ID="tbxRoomNumber" runat="server" CssClass="form-control" Width="113px" ReadOnly="True"></asp:TextBox>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="6">
                            <hr />
                        </td>
                    </tr>
                    <tr>
                        <td class="text-right" style="width: 156px">First Name:</td>
                        <td>&nbsp;</td>
                        <td style="width: 205px">
                            <asp:TextBox ID="tbxFirstName" runat="server" CssClass="form-control" Width="130px" Enabled="False"></asp:TextBox>
                        </td>
                        <td class="text-right" style="width: 108px">Last Name:</td>
                        <td>&nbsp;</td>
                        <td>
                            <asp:TextBox ID="tbxLastName" runat="server" CssClass="form-control" Width="130px" Enabled="False"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td class="text-right" style="width: 156px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td style="width: 205px">&nbsp;</td>
                        <td class="text-right" style="width: 108px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                    <tr>
                        <td class="text-right" style="width: 156px">Contact Number:</td>
                        <td>&nbsp;</td>
                        <td style="width: 205px">
                            <asp:TextBox ID="tbxContact" runat="server" CssClass="form-control" Width="130px" Enabled="False"></asp:TextBox>
                        </td>
                        <td class="text-right" style="width: 108px">Email Address:</td>
                        <td>&nbsp;</td>
                        <td>
                            <asp:TextBox ID="tbxEmail" runat="server" CssClass="form-control" Width="185px" Enabled="False"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td style="width: 156px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td style="width: 205px">&nbsp;</td>
                        <td style="width: 108px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                    <tr>
                        <td class="text-right" colspan="6">
                            <table class="nav-justified" style="width: 350px; margin: 0 auto;">
                                <tr>
                                    <td style="width: 72px">NRIC Number:</td>
                                    <td>&nbsp;</td>
                                    <td>
                                        <asp:TextBox ID="tbxNRIC" runat="server" CssClass="form-control" Enabled="False" MaxLength="9" Width="150px"></asp:TextBox>
                                    </td>
                                </tr>
                                <tr>
                                    <td style="width: 72px">&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                </tr>
                                <tr>
                                    <td style="width: 72px">Address:</td>
                                    <td>&nbsp;</td>
                                    <td>
                                        <asp:TextBox ID="tbxAddress" runat="server" CssClass="form-control" Height="86px" TextMode="MultiLine" Width="208px" Enabled="False"></asp:TextBox>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td style="width: 156px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td style="width: 205px">&nbsp;</td>
                        <td style="width: 108px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                    <tr>
                        <td class="text-right" style="width: 156px">Check-in<br />
                            Date &amp; Time:</td>
                        <td>&nbsp;</td>
                        <td style="width: 205px">
                            <asp:TextBox ID="tbxCheckIn" runat="server" CssClass="form-control" Width="175px" ReadOnly="True"></asp:TextBox>
                        </td>
                        <td class="text-right" style="width: 108px">Desired Checkout Date:</td>
                        <td>&nbsp;</td>
                        <td>
                            <asp:Calendar ID="cldCheckout" runat="server" Height="166px" Width="203px" Enabled="False" OnDayRender="cldCheckout_DayRender" OnSelectionChanged="cldCheckout_SelectionChanged"></asp:Calendar>
                            <br />
                            <asp:TextBox ID="tbxCheckOut" runat="server" CssClass="form-control" Width="183px" ReadOnly="True"></asp:TextBox>
                            <br />

                        </td>
                    </tr>
                    <tr>
                        <td class="text-right" style="width: 156px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td style="width: 205px">&nbsp;</td>
                        <td class="text-right" style="width: 108px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                    <tr>
                        <td class="text-right" style="width: 156px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td style="width: 205px">&nbsp;</td>
                        <td class="text-right" style="width: 108px">&nbsp;</td>
                        <td>&nbsp;</td>
                        <td>&nbsp;</td>
                    </tr>
                    <tr>
                        <td colspan="6">
                            <fieldset>
                                <legend><small>Payment Details</small></legend>
                                <table class="nav-justified" style="width: 400px; margin: 0 auto;">
                                    <tr>
                                        <td style="width: 143px">&nbsp;</td>
                                        <td style="width: 17px">&nbsp;</td>
                                        <td>&nbsp;</td>
                                    </tr>
                                    <tr>
                                        <td class="text-right" style="width: 143px">Card Type:</td>
                                        <td style="width: 17px">&nbsp;</td>
                                        <td>
                                            <asp:DropDownList ID="ddlCardType" runat="server" CssClass="form-control" Width="171px" Enabled="False">
                                                <asp:ListItem>Not Selected</asp:ListItem>
                                                <asp:ListItem>Mastercard</asp:ListItem>
                                                <asp:ListItem>Visa</asp:ListItem>
                                                <asp:ListItem>American Express</asp:ListItem>
                                            </asp:DropDownList>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="text-right" style="width: 143px">Cardholder Name:</td>
                                        <td style="width: 17px">&nbsp;</td>
                                        <td>
                                            <asp:TextBox ID="tbxCardholderName" runat="server" CssClass="form-control" Width="201px" Enabled="False"></asp:TextBox>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="text-right" style="width: 143px">Card Number:</td>
                                        <td style="width: 17px">&nbsp;</td>
                                        <td>
                                            <asp:TextBox ID="tbxCardNo" runat="server" CssClass="form-control" Width="200px" Enabled="False"></asp:TextBox>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="text-right" style="width: 143px">Expiry Date:</td>
                                        <td style="width: 17px">&nbsp;</td>
                                        <td>
                                            <div class="form-inline">
                                                <asp:DropDownList ID="ddlExpiryMonth" runat="server" CssClass="form-control" Width="82px" Enabled="False">
                                                    <asp:ListItem>-</asp:ListItem>
                                                    <asp:ListItem>1</asp:ListItem>
                                                    <asp:ListItem>2</asp:ListItem>
                                                    <asp:ListItem>3</asp:ListItem>
                                                    <asp:ListItem>4</asp:ListItem>
                                                    <asp:ListItem>5</asp:ListItem>
                                                    <asp:ListItem>6</asp:ListItem>
                                                    <asp:ListItem>7</asp:ListItem>
                                                    <asp:ListItem>8</asp:ListItem>
                                                    <asp:ListItem>9</asp:ListItem>
                                                    <asp:ListItem>10</asp:ListItem>
                                                    <asp:ListItem>11</asp:ListItem>
                                                    <asp:ListItem>12</asp:ListItem>
                                                </asp:DropDownList>
                                                /
                                                <asp:DropDownList ID="ddlExpiryYear" runat="server" CssClass="form-control" Width="82px" Enabled="False">
                                                    <asp:ListItem>-</asp:ListItem>
                                                    <asp:ListItem>14</asp:ListItem>
                                                    <asp:ListItem>15</asp:ListItem>
                                                    <asp:ListItem>16</asp:ListItem>
                                                    <asp:ListItem>17</asp:ListItem>
                                                    <asp:ListItem>18</asp:ListItem>
                                                    <asp:ListItem>19</asp:ListItem>
                                                    <asp:ListItem>20</asp:ListItem>
                                                    <asp:ListItem>21</asp:ListItem>
                                                    <asp:ListItem>22</asp:ListItem>
                                                    <asp:ListItem>23</asp:ListItem>
                                                    <asp:ListItem>24</asp:ListItem>
                                                    <asp:ListItem>25</asp:ListItem>
                                                </asp:DropDownList>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="text-right" style="width: 143px">Security Code (CSC):</td>
                                        <td style="width: 17px">&nbsp;</td>
                                        <td>
                                            <asp:TextBox ID="tbxCSC" runat="server" CssClass="form-control" Width="70px" Enabled="False"></asp:TextBox>
                                        </td>
                                    </tr>
                                </table>

                            </fieldset>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="6">&nbsp;</td>
                    </tr>
                    <tr>
                        <td colspan="6" class="text-center">
                            <asp:Button ID="btnBook" runat="server" Text="Book" CssClass="btn btn-default btn-lg" Enabled="False" OnClientClick="" OnClick="btnBook_Click" />
                            <asp:Button ID="btnClear" runat="server" Text="Clear" CssClass="btn btn-default btn-lg" OnClientClick="this.form.reset();setCheckInDateTime();return false;" Enabled="False" />
                        </td>
                    </tr>
                </table>

            </div>
        </div>
    </asp:Panel>

    <asp:Panel ID="pnlSecondStep" runat="server" Visible="false">
        <div class="panel panel-default" id="secondStep" style="width: 800px; margin: 0 auto;">
            <div class="panel-heading">
                Successful! - Book a Room
            </div>

            <div class="panel-body">
                <div class="alert alert-success" id="successBox" style="text-align:center;">
                    Your booking has been successfully placed!
                </div>
            </div>
            <div style="text-align:center"><asp:Button ID="btnGoBack" runat="server" Text="< Go back to Dashboard" CssClass="btn btn-default btn-lg" OnClick="btnGoBack_Click" /></div><br />
        </div>
    </asp:Panel>

    <script type="text/javascript">
        function transitionToSecondStep() {
            $('#secondStep').hide().show('slide', { direction: 'right', easing: 'easeOutQuart', duration: 250 });
        }

        function setCheckInDateTime() {
            $('#cphMain_tbxCheckIn').val(new Date().toLocaleString());
        }

        setCheckInDateTime();

        function verifyNoGuestInput() {
            var NoAdult = $('#cphMain_tbxNoAdult').val();
            var NoChildren = $('#cphMain_tbxNoChildren').val();

            if ((NoAdult.length == 0) || (NoChildren.length == 0)) {
                $('#errorBox').html('<strong>Error:</strong> You need to enter the number of <i>adults</i> and <i>children</i>! If none, enter 0.');
                $('#errorBox').hide().show();
                return false;
            }

            if ((is_int(NoAdult) != true) || (is_int(NoChildren) != true)) {
                $('#errorBox').html('<strong>Error:</strong> Invalid datatype! You need to enter a number.');
                $('#errorBox').hide().show();
                return false;
            }

            if ((NoAdult == "0") && (NoChildren == "0")) {
                $('#errorBox').html('<strong>Error:</strong> Number of adults and children cannot be 0 at the same time!');
                $('#errorBox').hide().show();
                return false;
            }
        }

        function verifyBook() {
            var firstName = $('#cphMain_tbxFirstName').val();
            var lastName = $('#cphMain_tbxLastName').val();
            var contactNo = $('#cphMain_tbxContact').val();
            var emailAddress = $('#cphMain_tbxEmail').val();
            var nric = $('#cphMain_tbxNRIC').val();
            var address = $('#cphMain_tbxAddress').val();
            var checkOut = $('#cphMain_tbxCheckOut').val();
            var cardType = $('#cphMain_ddlCardType').val();
            var name = $('#cphMain_tbxCardholderName').val();
            var number = $('#cphMain_tbxCardNo').val();
            var monthExpiry = $('#cphMain_ddlExpiryMonth').val();
            var yearExpiry = $('#cphMain_ddlExpiryYear').val();
            var CSC = $('#cphMain_tbxCSC').val();

            if ((firstName.length == 0) || (lastName.length == 0) || (contactNo.length == 0) || (emailAddress.length == 0)
                || (nric.length == 0) || (address.length == 0) || (checkOut.length == 0)
                || (cardType == "Not Selected") || (name.length == 0) || (number.length == 0) || (monthExpiry == "-")
                || (yearExpiry == "-") || (CSC.length == 0)) {
                $('#errorBox').html('<strong>Error:</strong> One or more required fields are empty!');
                $('#errorBox').hide().show();
                return false;
            }
        }

        $('#cphMain_tbxNoAdult').focus().keydown(function () {
            $('#errorBox').hide();
        });

        $('#cphMain_tbxNoChildren').keydown(function () {
            $('#errorBox').hide();
        });

        function is_int(value) {
            for (i = 0 ; i < value.length ; i++) {
                if ((value.charAt(i) < '0') || (value.charAt(i) > '9')) return false;
            }
            return true;
        }
    </script>
</asp:Content>
